<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>

    <script>

        // 节流
        //    在一段时间内只执行一次，函数一旦开始执行了，那么t这个时间内不再触发

        // var flag = true;

        // window.onresize = function () {
        //     if (flag) {
        //         flag = false;
        //         setTimeout(() => {
        //             console.log(1);
        //             flag = true;
        //         }, 500)
        //     }
        // }



        function throttle(cb, t = 300) {
            var flag = true;

            // 此函数代表着事件处理函数
            //     this指向问题
            //     事件对象
            return function (e) {
                if (flag) {
                    flag = false;
                    setTimeout(() => {
                        // cb本身是一个普通函数，它自己的this指向window
                        cb.call(this, e)
                        flag = true;
                    }, t)
                }
            }
        }


        document.onclick = throttle(function (e) {
            console.log(this);
            console.log(e)
        })

    </script>

</body>

</html>